<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--css样式引入-->
<head th:replace="blog/common::head-fragment"></head>
<body>

<nav th:replace="blog/common::nav-fragment"></nav>

<!-- /////////////////////////////////////////Header -->
<header th:replace="blog/common::page-top">

</header>
<!-- Header -->
<div class="gradient-line clearfix">
    <div style="background: none repeat scroll 0% 0% #F69087;"></div>
    <div style="background: none repeat scroll 0% 0% #85CCB1;"></div>
    <div style="background: none repeat scroll 0% 0% #966b20;"></div>
    <div style="background: none repeat scroll 0% 0% #85A9B3;"></div>
    <div style="background: none repeat scroll 0% 0% #B0CB7A;"></div>
</div>

<!-- /////////////////////////////////////////Content -->
<div id="page-content" class="index-page">
    <div class="container">
        <div id="main-content" class="col-md-8">
            <article th:each="blog:${allBlog}">
                <div class="art-header">
                    <!--显示博客标题-->
                    <a th:href="'/details/' + ${blog.getBlogId()}"><h2 th:text="${blog.getBlogTitle()}" style="text-transform: none;display: inline"></h2></a>
                    <span>&nbsp in&nbsp&nbsp</span>
                    <a th:href="'/queryForCategoryId/' + ${blog.getBlogCategoryId()}" th:text="${blog.getBlogCategoryName()}" style="text-transform: none;display: inline"></a>
                    <!--这里显示博客的创建时间和类别，后期可以增加博客的创始人和评论数-->
                    <div th:text="${'创建时间:' + blog.getAboutTime()}" style="float: right;color: #4e555b"></div>
                </div>
                </br>
                <div class="art-content">
                    <div class="col-md-7">
                        <a th:href="'/details/' + ${blog.getBlogId()}"><img th:src="${blog.getBlogCoverImage()}" style="width: 800px;height: 200px;display:block;" /></a>
                    </div>
                    <div class="col-md-5">
                        <i class="fa fa-table nav-icon" aria-hidden="true"></i><span th:text="'&nbsp&nbsp创建时间：' + ${blog.getAboutTime()}" ></span>
                        <br />
                        <br />
                        <i class="nav-icon fa fa fa-pencil-square-o" aria-hidden="true"></i><span style="color: ghostwhite">&nbsp&nbsp作者：Aegean</span>
                        <br/>
                        <br/>
                        <i class="fa fa-bookmark nav-icon" aria-hidden="true"></i><a th:href="'/queryForCategoryId/' + ${blog.getBlogCategoryId()}" th:text="'&nbsp&nbsp&nbsp分类：' + ${blog.getBlogCategoryName()}"></a>
                        <br />
                        <br />
                        <i class="fa fa-tags nav-icon" aria-hidden="true"></i><span th:text="'&nbsp&nbsp标签：' + ${blog.getBlogTags()}"></span>
                        <br />
                        <br />
                        <a th:href="'/details/' + ${blog.getBlogId()}" class="btn btn-3 f-right">更多</a>
                    </div>
                </div>
            </article>
            <p style="color: gray; font-size: 15px">--------------------------------------------------人家是有底线的哦--------------------------------------------------</p>
        </div>

        <div th:replace="blog/common::side-bar"></div>
    </div>
</div>
<div class="gradient-line clearfix">
    <div style="background: none repeat scroll 0% 0% #F69087;"></div>
    <div style="background: none repeat scroll 0% 0% #85CCB1;"></div>
    <div style="background: none repeat scroll 0% 0% #966b20;"></div>
    <div style="background: none repeat scroll 0% 0% #85A9B3;"></div>
    <div style="background: none repeat scroll 0% 0% #B0CB7A;"></div>
</div>

<footer th:replace="blog/common::footer"></footer>

<div th:replace="blog/common::JavaScript-fragment"></div>

</body>
</html>